<template>
	<el-dialog title="新增管理员" :visible.sync="dialogVisible" width="800px" :close-on-click-modal="false"
		:modal-append-to-body="false" v-drag2anywhere>
		<el-form :model="formData" ref="formData" label-width="100px" :rules="rules">
			<el-row :gutter="30">
				<el-col :span="12">
					<el-form-item label="登录账号" prop="username">
						<el-input v-model="formData.username" placeholder="管理员账号" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="角色" prop="roleid">
						<el-select v-model="formData.roleid" style="width: 100%;">
							<el-option label="超级管理员" value="1"></el-option>
							<el-option label="普通职员" value="2"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				
				<el-col :span="12">
					<el-form-item label="管理员姓名" prop="nickname">
						<el-input v-model="formData.nickname" placeholder="管理员姓名" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="手机号码" prop="mobile">
						<el-input v-model="formData.mobile"   placeholder="手机号码" clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="30">
				<el-col :span="12">
					<el-form-item label="登录密码" prop="password">
						<el-input v-model="formData.password" type="passowrd" show-password placeholder="登录密码" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="确认密码" prop="password1">
						<el-input v-model="formData.password1" type="passowrd1" show-password placeholder="确认密码" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<div style="line-height: 30px; padding: 0px 10px;color:#888"></div>
				</el-col>
			</el-row>
		</el-form>



		<div slot="footer" style="text-align: center;">
			<el-button @click="dialogVisible = false" size="medium">取 消</el-button>
			<el-button type="primary" size="medium" @click="handleSave">确定</el-button>
		</div>
	</el-dialog>
</template>

<script>
	export default {
		data() {
			return {
				index:-1,
				formData: {
					username: '',
					nickname: '',
					moblie: '',
					roleid: '',
					role: ''
				},
				rules:{
					"username":[{required:true,message:"管理员账号不能为空",trigger:"blur"}],
					"nickname":[{required:true,message:"管理员姓名不能为空",trigger:"blur"}],
					"password":[{required:true,message:"登录密码不能为空",trigger:"blur"}],
					"password1":[{required:true,message:"确认密码不能为空",trigger:"blur"}],
					"mobile":[{required:true,message:"请填写手机号码",trigger:"blur"}],
					"roleid":[{required:true,message:"请选择用户角色",trigger:"change,blur"}],
				},
				dialogVisible: false
			}
		},
		methods:{
			init(index,data){
				this.index=index;
				this.formData=data;
			},
			handleSave(){
				this.$refs.formData.validate((ok)=>{
					console.log(ok);
				});
			}
		}
	}
</script>

<style>
</style>